<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<title>
			商品编辑
		</title>
		<meta name="renderer" content="webkit">
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
		<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
		<meta name="apple-mobile-web-app-status-bar-style" content="black">
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="format-detection" content="telephone=no">
		<link rel="stylesheet" href="./css/x-admin.css" media="all">
		<link rel="stylesheet" href="css/jquery.mobile.min.css" />
		<link href="css/xtiper.css" type="text/css" rel="stylesheet" />
		<script src="js/xtiper.min.js" type="text/javascript"></script>
	</head>

	<body onload="searchstate()">
		<div class="x-body">
			<div class="layui-form-item">
				<label class="layui-form-label">
                        <span class="x-red">*</span>商品图片
                    </label>
				<div class="layui-input-inline">
					<form enctype="multipart/form-data" id="uploadForm">
						<input type="file" id="file" style="width: 190px;height: 40px;" onchange="preImg(this.id,'imgPre');">
					</form>
					<img id="imgPre" src="" width="100px" height="100px" style="display: block;" />
				</div>
			</div>
			<div class="layui-form-item">
				<label class="layui-form-label">
                        <span class="x-red">*</span>商品名称
                    </label>
				<div class="layui-input-inline">
					<input type="text" id="goodsname" class="layui-input">
				</div>
			</div>

			<div class="layui-form-item">
				<label class="layui-form-label">
                        <span class="x-red">*</span>商品类型
                    </label>
				<div>
					<select name="type" id="searchs" style="width: 190px;border: solid 1px #E6E6E6;height: 40px;">
					</select>
				</div>
			</div>
			<div class="layui-form-item">
				<label class="layui-form-label">
                        <span class="x-red">*</span>单位
                    </label>
				<div>
					<select name="type" id="units" style="width: 190px;border: solid 1px #E6E6E6;height: 40px;">
					</select>
				</div>
			</div>
			<div class="layui-form-item">
				<label class="layui-form-label">
                        <span class="x-red">*</span>单价
                    </label>
				<div class="layui-input-inline">
					<input type="text" id="price" class="layui-input">
				</div>
			</div>
			<div class="layui-form-item">
				<label class="layui-form-label">
                        <span class="x-red">*</span>总有量
                    </label>
				<div class="layui-input-inline">
					<input type="text" id="goodstotal" class="layui-input">
				</div>
			</div>

			<div class="layui-form-item">
				<label class="layui-form-label">
                        <span class="x-red">*</span>商品介绍
                    </label>
				<div class="layui-input-inline">
					<input type="text" id="goodsintroduce" class="layui-input">
				</div>
			</div>
			<div class="layui-form-item">
				<label class="layui-form-label">
                    </label>
				<div onclick="save()">
					<button class="layui-btn"> 保存 </button>
				</div>
			</div>
		</div>
		<script src="./lib/layui/layui.js" charset="utf-8">
		</script>
		<script src="./js/x-layui.js" charset="utf-8">
		</script>
		<script src="js/jquery.min.js"></script>
		<script type="text/javascript">
			var changImg = 0;

			function searchstate() {
				var src = 'images/speciesImg/' + JSON.parse(sessionStorage.getItem("speciesImg"));
				$("#imgPre").attr("src", src);
				$("#goodsname").val(JSON.parse(sessionStorage.getItem("speciesName")));
				$("#price").val(JSON.parse(sessionStorage.getItem("speciesPrice")));
				$("#goodstotal").val(JSON.parse(sessionStorage.getItem("speciesTotal")));
				$("#goodsintroduce").val(JSON.parse(sessionStorage.getItem("speciesIntroduce")));
				var settings = {
					"url": "http://127.0.0.1:8080/type/findall",
					"method": "GET",
					"timeout": 0,
					"headers": {
						"Content-Type": "application/json"
					},
				};
				$.ajax(settings).done(function(response) {
					for(var i = 0; i < response.length; i++) {
						$("#searchs").append("<option value='" + response[i].typeName + "'>" + response[i].typeName + "</option>");
					}
				});

				var settings = {
					"url": "http://localhost:8080/unit/findall",
					"method": "POST",
					"timeout": 0,
					"headers": {
						"Content-Type": "application/json"
					},
				};
				$.ajax(settings).done(function(response) {
					for(var i = 0; i < response.length; i++) {
						$("#units").append("<option value='" + response[i].unitName + "'>" + response[i].unitName + "</option>");
					}
				});

				$("#searchs").append("<option value='" + JSON.parse(sessionStorage.getItem("typeName")) + "'>" + JSON.parse(sessionStorage.getItem("typeName")) + "</option>");
				$("#units").append("<option value='" + JSON.parse(sessionStorage.getItem("unitName")) + "'>" + JSON.parse(sessionStorage.getItem("unitName")) + "</option>");

			}
		</script>
		<!--
        	作者：1005914681@qq.com
        	时间：2020-02-06
        	描述：预览图片
        -->
		<script type="text/javascript">
			function getFileUrl(sourceId) {
				var url;
				if(navigator.userAgent.indexOf("MSIE") >= 1) { // IE 
					url = document.getElementById(sourceId).value;
				} else if(navigator.userAgent.indexOf("Firefox") > 0) { // Firefox 
					url = window.URL.createObjectURL(document.getElementById(sourceId).files.item(0));
				} else if(navigator.userAgent.indexOf("Chrome") > 0) { // Chrome 
					url = window.URL.createObjectURL(document.getElementById(sourceId).files.item(0));
				}
				return url;
			}

			function preImg(sourceId, targetId) {
				var url = getFileUrl(sourceId);
				var imgPre = document.getElementById(targetId);
				imgPre.src = url;
				changImg++;
			}
		</script>
		<!--
			var str = "/" + file.replace(/\\/g, "\/"); //反斜杠转化为斜杠
		-->
		<script type="text/javascript">
			function save() {
				if($("#goodsname") == "") {
					xtip.msg('商品名为空！');
				} else if($("#price").val() == "") {
					xtip.msg('价格未填！');
				} else if($("#goodsintroduce") == "") {
					xtip.msg('商品介绍为空！');
				} else if($("#goodstotal") == "") {
					xtip.msg('商品总有量为空，如果没有货设置为0！');
				} else if($("#goodsname").val() == JSON.parse(sessionStorage.getItem('speciesName'))) {
					saveInfor();
				} else if(changImg != 0) {
					reupdateImg();
				} else {
					var url = "http://localhost:8080/species/findspeciesname?speciesName=" + $("#goodsname").val();
					var settings = {
						"url": url,
						"method": "POST",
						"timeout": 0,
						"headers": {
							"Content-Type": "application/json"
						},
					};
					$.ajax(settings).done(function(response) {
						if(response == 0) {
							saveInfor();
						} else {
							reuser(response);
						}
					});
				}
			}
		</script>
		<script type="text/javascript">
			function reupdateImg() {
				var form = new FormData(document.getElementById("uploadForm"));
				form.append("multipartFile", $('#file')[0].files[0]);
				var str = 'http://localhost:8080/species/updateImg?speciesId=' + sessionStorage.getItem("speciesId") + '&speciesTotal=' + $("#goodstotal").val() + '&speciesName=' + $("#goodsname").val() + '&speciesPrice=' + $("#price").val() + '&speciesIntroduce=' + $("#goodsintroduce").val() + '&typeName=' + $("#searchs").val() + '&unitName=' + $("#units").val();
				$.ajax({
					url: str,
					data: form,
					type: 'POST',
					dataType: 'JSON',
					cache: false,
					processData: false,
					contentType: false,
					success: function(data) {
						xtip.msg('修改成功！');
						clearImg();
						setTimeout(function() {
							x_admin_close();
						}, 1000);
					},
					error: function() {
						xtip.msg('修改失败！');
					}
				})

			}
			function clearImg() {
				var str = 'http://127.0.0.1:8080/species/clearImg';
				var settings = {
					"url": str,
					"method": "GET",
					"timeout": 0,
					"headers": {
						"Content-Type": "application/json"
					}
				};
				$.ajax(settings).done(function(response) {
					console.log('success delete old IMg');
				});
			}
		</script>
		<script type="text/javascript">
			layui.use(['layer'], function() {
				layer = layui.layer; //弹出层
			});

			function reuser(speciesId) {
				xtip.confirm('查询到相同名称的历史商品，可能是同一商品，是否重新启用？', function() {
					var url = 'http://127.0.0.1:8080/species/updateState?speciesId=' + speciesId;
					var settings = {
						"url": url,
						"method": "GET",
						"timeout": 0,
						"headers": {
							"Content-Type": "application/json"
						},
					};
					$.ajax(settings).done(function(response) {
						xtip.msg('启用成功');
						setTimeout(function (){
							x_admin_close();
						},1000)
						
					});
				});
			}
		</script>
		<script type="text/javascript">
			function saveInfor() {
				var str = 'http://localhost:8080/species/update?speciesId=' + sessionStorage.getItem("speciesId") + '&speciesTotal=' + $("#goodstotal").val() + '&speciesName=' + $("#goodsname").val() + '&speciesPrice=' + $("#price").val() + '&speciesIntroduce=' + $("#goodsintroduce").val() + '&typeName=' + $("#searchs").val() + '&unitName=' + $("#units").val();
				$.ajax({
					url: str,
					type: 'POST',
					dataType: 'JSON',
					cache: false,
					processData: false,
					contentType: false,
					success: function(data) {
						xtip.msg('修改成功！');
						setTimeout(function() {
							x_admin_close();
						}, 1000);
					},
					error: function() {
						xtip.msg('修改失败！');
					}
				})

			}
		</script>
	</body>

</html>